@extends('admin.layouts.master')

@section('content')

<div class="row aw-list">
	<div class="col-lg-12">
		<section class="row form-inline aw-list-head">
			<div class="col-sm-12 col-md-8">
				<div class="aw-head-search aw-float-left">
					<div class="form-group">
						<input type="text" maxlength="8" class="form-control" id="content" name="content" v-model="form.content" :value="form.content" placeholder="最多四个汉字8个字符" v-on:keyup.enter="List_Add()">
					</div>
					<a class="btn btn-green" v-on:click="List_Add()"><i class="icon-plus"></i> 添加</a>
				</div>
			</div>
		</section>
		<section class="panel aw-content">
			<header class="panel-heading">标签列表</header>
			<ul class="aw-team-comment-list aw-overflow-hidden">
				<li class="aw-team-comment-li" v-for="(list, key) in lists">
					@{{list.content}}
					<a class="btn btn-gules btn-xs" v-on:click="List_Del(list.id,list.content)"><i class="icon-trash"></i></a>
				</li>
			</ul>
			<div class="aw-text-center aw-list-null" v-if="lists.length==0">暂无数据</div>
			<vue-page :page_item="page_item" :page_this="page_this" :page_all="page_all" :Call_back="Call_back"></vue-page>
		</section>
	</div>
</div>

@section('pagejs')
@parent

<!--日期插件-->
<script type="text/javascript" src="/admin/js/ga.js"></script>
<script type="text/javascript" src="/admin/assets/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>

<script type="text/javascript" src="/admin/js/vue-page.js"></script>
<script type="text/javascript" src="/admin/js/page.js"></script>
<script type="text/javascript">
var MJS_URLArry=URLArry;
MJS_URLArry.page_num=100;
var AD_list={
	api:'/adminapi/comment/list',
	form_data:MJS_URLArry,
	tips:false,
}
var Ajax_Vue_Fun=function(vue_data){
	console.log('vue_data')
	console.log(vue_data)
	var Data_Vue=ajax_data_res(vue_data)
	Data_Vue.form={content:''};
	vm=new Vue({
		el:'#Vue-Body',
		data:Data_Vue,
		components:{
			'vue-page':Vpage
		},methods:{
			Call_back:function(page){
				Vm_Call_back_Page(page)
			},List_Del:function(id,name){
				var AD_del={
					api:'/adminapi/comment/del',
					form_data:{id:id},
					tips:'删除标签 ['+name+'] 成功',
					msg:'是否删除 ['+name+'] 该标签？',
				}
				Vm_List_Status(AD_del)
			},List_Add:function(){
				var AD_info={
					api:'/adminapi/comment/save',
					form_data:this.form,
					tips:'添加标签成功',
				}
				if(!this.form.content){
					msgTips('请填写标签,最多四个汉字8个字符',2)
					return;
				}
				postData(AD_info,function(vue_data_info){
					Vm_List_Get_Data(vm.page_this)
					vm.form={content:''};
				})
			}
		}
	})
}
getData(AD_list,Ajax_Vue_Fun)
</script>
@endsection

@endsection

